import Vue from 'vue'
import pluginImport from '@d2-projects/vue-table-import'
Vue.use(pluginImport)

<template>
  <d2-container type="card">
    <template slot="header">导入 xlsx</template>
    <div class="d2-mb">
      <el-upload :before-upload="handleUpload" action="default">
        <el-button type="success">
          <d2-icon name="file-o"/>
          选择要导入的 .xlsx 表格
        </el-button>
      </el-upload>
    </div>
    <div class="inner">
      <ve-line :data="chartData"></ve-line>
    </div>
  </d2-container>
</template>

<script>
export default {
  name: 'charts-import',
  data () {
    return {
      chartData: {
        columns: [],
        rows: []
      }
    }
  },
  methods: {
    handleUpload (file) {
      this.$import.xlsx(file)
        .then(({ header, results }) => {
          this.chartData.columns = header
          this.chartData.rows = results
        })
      return false
    }
  }
}
</script>
